<template>
	<view class="bigbox">
		<view class="head_box">
			<view class="sousuo">
				<image src="../../static/74.png" mode=""></image>
				<input v-model="order_ss" type="text" value="" placeholder="查询订单（输入客户姓名/手机号码）"/>
			</view>
			<view class="sousuo1" @click="sousuo_f()">搜索</view>
		</view>
		<!-- <view class="list_box"> -->
			<view class="kong" v-if="list2 == ''"><image src="../../static/84.png" mode=""></image></view>
			<view class="box" v-for="item in list2" v-if="list2 != ''">
				<view @click="tz(item)" >
					<view class="box_1">
						<image src="../../static/75.png" mode=""></image>
						<view style="margin: 0 20rpx;">{{item.query01}}</view>
						<view class="box_2">{{item.query17}}</view>
						<view class="box_10" v-if="type1 == 'fkzx'">{{item.data01}}</view>
						<view class="box_10" v-if="type1 == 'fkzx'">{{item.data02}}</view>
					</view>
					<view class="box_3">
						<view class="box_4">客户姓名</view>
						<view>{{item.query03}}</view>
					</view>
					<view class="box_3">
						<view class="box_4">申请借款金额</view>
						<view>{{item.query21}}</view>
					</view>
					<view class="box_3">
						<view class="box_4">申请借款期限</view>
						<view>{{item.query22}}</view>
					</view>
					<view class="box_3">
						<view class="box_4">申请借款时间</view>
						<view>{{item.createTime}}</view>
					</view>
					<view class="box_6"><image src="../../static/76.png" mode=""></image></view>
					<view class="box_11" v-if="type1 == 'fkzx'">{{item.data03}}</view>
				</view>
				<view class="box_5" @click="sprz(item)">
					<!-- <view>{{item.query39}}</view> -->
					<view>审批日志</view>
					<image src="../../static/77.png" mode=""></image>
				</view>
			</view>
		<!-- </view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				scrollLeft: 0,
				list1:[],
				list2:[],
				ind:0,
				ind1:0,
				order_ss:'',
				type1:'',
				num:'',
				type:{}
			};
		},
		onNavigationBarButtonTap() {
			this.show = !this.show
			console.log('点击了自定义按钮');
		},
		onLoad:function(option) {
			this.initial()
		},
		// onPullDownRefresh() {
			
		// },
		onReachBottom() {
			console.log(41188)
			this.num ++ 
			this.$get('buse/fxjBuse_02/list-ycl',{
				pageNo:this.num,
				pageSize:10,
			}).then((res)=>{
				console.log(res.data.result.records)
				if(res.data.result.records != ''){
					res.data.result.records.forEach((item)=>{
						this.list2.push(item)
					})
				}else{
					uni.showToast({
						title:'没有更多数据了~',
						icon:'none'
					})
				}
			})
		},
		methods: {
			sprz:function(item){
				uni.navigateTo({
					url:'../sprz/sprz?item=' + JSON.stringify(item)
				})
			},
			sousuo_f:function(){
				this.$get('buse/fxjBuse_02/list-ycl',{
					query39:this.order_ss
				}).then((res)=>{
					console.log(res.data)
					this.list2 = res.data.result.records
				})
			},
			initial:function(){
				this.num = 1
				this.list2 = []
				this.$get('buse/fxjBuse_02/list-ycl',{
					pageNo:1,
					pageSize:10,
				}).then((res)=>{
					this.list2 = res.data.result.records
				})
			}
			
		}
	};
</script>

<style>
	.kong>image{
		width: 400rpx;
		height: 400rpx;
	}
	.kong{
		display: flex;
		justify-content: center;
		margin-top: 100rpx;
	}
	.list_box{
		height: calc(100vh  - 180rpx - var(--status-bar-height));
		overflow: hidden;
		overflow-y: scroll;
		border: 1px solid red;
	}
	.my_tab{
		margin-bottom: 30rpx;
	}
	.sousuo1{
		width: 100rpx;
		height:64rpx;
		color: #FFFFFF;
		background:#4185F5;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 10rpx;
		margin-left: 20rpx;
	}
	.head_box{
		width: calc(100vw - 60rpx);
		height: 130rpx;
		display: flex;
		align-items: center;
		margin-top: 20rpx;
		margin-bottom: 30rpx;
		position: fixed;
		top:50rpx;
		left: 30rpx;
		z-index: 10000;
		background-color: #FFFFFF;
	}
	.active1{
		background-color: #4185F5;
		color: #FFFFFF !important;
		border: 1px solid rgba(2, 106, 254, 0.31) !important;
	}
	.tab_box>view{
		width: 24%;
		height: 54rpx;
		font-size: 24rpx;
		margin-right: 0.8%;
		margin-bottom: 10rpx;
		border-radius: 10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		border: 1px solid #CCCCCC;
		white-space: nowrap;
	}
	.tab_box{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		margin-bottom: 30rpx;
	}
	.active{
		background:rgba(58,98,255,1) !important;
		color: #FFFFFF !important;
	}
	.bg{
		width: 100vw;
		height: 100vh;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
		background: rgba(0,0,0,0.3);
	}
	.pup_box>view{
		width:32%;
		height:74rpx;
		background:rgba(242,242,242,1);
		border-radius:10rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size:30rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(102,102,102,1);
		margin-bottom: 20rpx;
		margin-right: 1%;
	}
	.pup_box{
		padding: 30rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		flex-wrap: wrap;
		background: #FFFFFF;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 101;
	}
	.box_6>image{
		width: 100%;
		height: 100%;
	}
	.box_6{
		width: 300rpx;
		height: 200rpx;
		position: absolute;
		bottom: 28rpx;
		right: -100rpx;
	}
	.box_5>image{
		width: 13rpx;
		height: 22rpx;
	}
	.box_5{
		width: 90%;
		height: 75rpx;
		/* padding-top: 20rpx; */
		border-top: 1px solid #E6E6E6;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size:26rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(58,98,255,1);
		position: absolute;
		z-index: 100;
	}
	.box_4{
		width: 160rpx;
		font-size:24rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(153,153,153,1);
		margin-right: 30rpx;
	}
	.box_3{
		display: flex;
		align-items: center;
		font-size:24rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:rgba(51,51,51,1);
		margin-bottom: 14rpx;
	}
	.box_10{
		padding: 3rpx 10rpx;
		box-sizing: border-box;
		border:1rpx solid #FF5555;
		border-radius:15rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size:20rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:#FF5555;
		margin-right: 10rpx;
	}
	.box_11{
		width: 140rpx;
		height: 60rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		color:#FFFFFF;
		background-color: #FF5555;
		position: absolute;
		top: 130rpx;
		right: 50rpx;
		border-radius: 20rpx;
	}
	.box_2{
		padding: 3rpx 25rpx;
		box-sizing: border-box;
		border:1rpx solid #4185F5;
		border-radius:200rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size:20rpx;
		font-family:PingFang SC;
		font-weight:500;
		color:#4185F5;
		margin-right: 10rpx;
	}
	.box_1>image{
		width: 60rpx;
		height: 41rpx;
	}
	.box_1{
		display: flex;
		align-items: center;
		font-size:34rpx;
		font-family:PingFang SC;
		font-weight:800;
		color:rgba(51,51,51,1);
		margin-bottom: 35rpx;
	}
	.box{
		height: 370rpx;
		background:rgba(255,255,255,1);
		box-shadow:0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.1);
		border-radius:10rpx;
		padding: 30rpx;
		box-sizing: border-box;
		position: relative;
		overflow: hidden;
		margin: 10rpx;
		margin-bottom: 30rpx;
	}
	.sousuo>input{
		width: 100%;
		height: 100%;
		font-size:24rpx;
		font-family:PingFang SC;
		font-weight:500;
	}
	.sousuo>image{
		width: 25rpx;
		height: 25rpx;
		margin-right: 10rpx;
	}
	.sousuo{
		width: 100%;
		height:64rpx;
		background:rgba(255,255,255,1);
		box-shadow:0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.1);
		border-radius:4rpx;
		padding: 0 20rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.bigbox{
		padding: 0 30rpx;
		padding-top: 120rpx;
		box-sizing: border-box;
	}
</style>
